iT邦幫忙

2024 iThome 鐵人賽

DAY 15
0
Software Development

我的SpringBoot絕學:7+2個專案,從新手變專家系列 第 15

Day15 第六個Spring Boot專案:小型電商購物車系統(1)專案介紹

  • 分享至 

  • xImage
  •  

如果你正在尋找如何完成一個電商專案,恭喜你來對地方了。

本專案是RESTful API後端專案,RESTful API後端很適合搭配前端框架,我們會搭配Vue.js的前端(Day27-30),進化成一個前後端分離專案。

我們的優點

  • 有教學
  • 照著做就能完成資料庫設定,不需加入群組。
  • 可以直接下載程式碼(連結Day22會給)
  • 免費
  • 串接支付平台(Stripe)

應該是iT邦幫忙,甚至是繁體中文,第一篇同時符合以上條件的電商專案

如果有人看到同樣符合條件的Spring Boot文章,歡迎在留言區分享。

我們的缺點

  • 小型專案,只有註冊登入、新增產品、加入購物車、結帳的功能
  • 沒有Swagger
  • 沒有Redis
  • 沒有RabbitMQ
  • 無法高併發,只能讓很少的人同時使用

成果圖片(需搭配Vue.js部分)

Entity格式和專案功能

User

欄位名稱 資料形態 說明
id String 唯一的id
email String 電子郵件
password String 密碼

Product

欄位名稱 資料形態 說明
id Long 唯一的id
name String 商品名稱
description String 商品描述
price Integer 價格
image String 商品圖片存放的網址
category String 商品的類別

Cart

欄位名稱 資料形態 說明
id Long 唯一的id
user User 關聯到用戶,用來將購物車與用戶的資訊連接
cartItems Set 購物車內的商品
totalPrice Integer 購物車內的商品的總價格
totalQuantity Integer 購物車內的商品數量

CartItem

欄位名稱 資料形態 說明
id Long 唯一的id
cart Cart 關聯到購物車,將Cart與CartItem的資訊連接
product Product 關聯到商品,將Product與CartItem的資訊連接
price Integer 商品的價格
quantity Integer 商品的數量

Order

欄位名稱 資料形態 說明
id Long 唯一的id
sessionId String Stripe API的Session ID
amount Integer Stripe顯示的結帳金額
url String Stripe的支付連結
userId Long 紀錄訂單是哪個用戶的

功能

路徑 HTTP request method 說明 Request body Request header
/auth/signup POST 註冊 User
/auth/login POST 登入 User
/api/user/ GET 取得目前登入的用戶資訊 JWT
/api/product/ POST 建立商品 Product JWT
/api/product/{id} DELETE 刪除商品 JWT
/api/product/{id} GET 取得商品 JWT
/api/product/?minPrice=&maxPrice=&category=&sort=&pageNumber=&pageSize= GET 根據條件篩選並分頁商品 JWT
/api/cart/ GET 取得購物車的內容 JWT
/api/cart/add PUT 將商品加入購物車 AddItemRequest JWT
/api/cartItem/{cartItemId} PUT 修改購物車內的商品數量 CartItem JWT
/api/cartItem/{cartItemId} DELETE 刪除購物車內的商品 JWT
/api/order/create_session GET 建立Stripe支付Session JWT
/api/order/find_order GET 找尋該用戶的所有訂單 JWT

專案建立

安裝設定建立專案後,下載並解壓縮。

連接資料庫

打開MySQL Client(MariaDB)輸入下面這行,建立資料庫。

CREATE DATABASE cart_db;

在application.properties添加

spring.datasource.url=jdbc:mariadb://localhost:3306/cart_db
spring.datasource.username=root
spring.datasource.password=密碼
spring.datasource.driver-class-name=org.mariadb.jdbc.Driver

spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true

啟動專案確認連接情況。

這樣直接寫在application.properties可能有點風險,使用git時可能不小心就把密碼洩露到GitHub上。

打開GitHub,搜尋datasource.password,可以看到有些人的密碼洩露了。

我們在專案的根目錄(和pom.xml同目錄)建立.env(沒有副檔名)寫入密碼。

DATASOURCE_PASSWORD=密碼

改寫一部分的application.properties

讀取專案根目錄的.env,[.properties]代表即使副檔名不是properties,也將其視為設定用的檔案

spring.config.import=file:.env[.properties]

spring.datasource.url=jdbc:mariadb://localhost:3306/cart_db
spring.datasource.username=root

對應.env中的內容,讀取DATASOURCE_PASSWORD

spring.datasource.password=${DATASOURCE_PASSWORD}

確認是否能夠正常連接。


上一篇
Day14 第五個Spring Boot專案:會員註冊登入系統(4)登出和自訂驗證系統
下一篇
Day16 第六個Spring Boot專案:小型電商購物車系統(2)Spring Security設定
系列文
我的SpringBoot絕學:7+2個專案,從新手變專家31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言